
<!DOCTYPE html>
<html lang="en">
<head>
    <link rel="shortcut icon" href="img/ic.png">
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>车队信息</title>

    <!-- Bootstrap Core CSS -->
    <link href="css/bootstrap.css" rel="stylesheet">

    <!-- Custom CSS -->
    <link href="css/sb-admin.css" rel="stylesheet">

    <!-- Morris Charts CSS -->
    <link href="css/plugins/morris.css" rel="stylesheet">
    <link href="dist/css/bootstrapValidator.css" rel="stylesheet">
    <!-- Custom Fonts -->
    <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css">
    <link rel="stylesheet" href="css/cdn/font_evmq6xwfabutyb9.css">
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="js/cdn/html5shiv-3.7.0.js"></script>
    <script src="js/cdn/respond-1.4.2.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" href="css/cdn/dataTables.bootstrap.css">
    <link rel="stylesheet" href="css/cdn/font_i0327076nave7b9.css">
    <link href="nuget/content/content/toastr.css" rel="stylesheet" type="text/css"/>
    <link rel="stylesheet" type="text/css" href="css/datatable.css"/>
    <link rel="stylesheet" href="layui_src/css/modules/layer/default/layer.css">
    <style>
        #example_paginate{
            float:right;
        }
        .handle-btn{
            cursor: pointer;
            margin: 0 2px;
        }
        #wrapper {
            padding-left:0px;
        }
        .navigation{
            border-bottom: 3px solid #edebeb;
        }

        .navigation a:hover{
            color: #0F6AFC;
            border-bottom: 2px solid #01AAED;
        }
        .this{
            color: #01aaed;
            font-weight:bold;
            border-bottom: 2px solid #01AAED;
        }
        #check>tbody>tr{
            line-height: 20px;
        }

        [v-cloak] {
            display: none;
        }

        /*.td_w2{*/
        /*width: 180px;*/
        /*}*/
        .td_w1{
            width: 100px;
        }

        .t2b {
            width: 15px;
            margin: 0 auto;
            line-height: 1.6rem;
            font-size: 1.4rem;
            word-wrap: break-word;/*英文的时候需要加上这句，自动换行*/

            /*writing-mode: vertical-lr;!*从左向右 从右向左是 writing-mode: vertical-rl;*!*/
            /*writing-mode: tb-lr;!*IE浏览器的从左向右 从右向左是 writing-mode: tb-rl；*!*/
        }
        .list-group-item-success{
            color: #fff;
            background:#1aa79d;
        }
        .team-info{
            border-bottom: 1px solid #337AB7;
        }
        .mtb{
            margin: .4rem auto;
        }
        .w3{
            width: 33%;
            display: inline-block;
        }
        .tp{
            width: 49%;
            display: inline-block;
            text-align: center;
        }
        @media screen and (min-width: 768px) {
            .auto-dot{
                border-left: 1px dotted #ccc;
            }
        }
        @media screen and (max-width: 767px) {
            .auto-dot{
                border-top: 1px dotted #ccc;
            }
        }
    </style>
</head>
<body>
<div id="wrapper">
    <div id="page-wrapper">
        <div class="container-fluid">
            <div class="row sss">
                <nav class="navbar navbar-default" role="navigation">
                    <ul class="nav navbar-nav">
                        <li><a href="index.html">首页</a></li>
                        <li><a href="ParticipatingTeams.html">参赛车队</a></li>
                        <li class="active"><a href="javascript:;"><span class="xuanzhong">车队详情</span></a></li>
                    </ul>
                </nav>
            </div>
            <div class="container-fluid">
                <div class="row team-info" v-cloak>
                    <div class="col-sm-3">
                        <strong>车队名称：</strong>
                        <span>{{teamsObj.teamName}}</span>
                    </div>
                    <div class="col-sm-3">
                        <strong>参赛车数：</strong>
                        <span>{{teamsObj.automobileQuantity}}</span>
                    </div>
                    <div class="col-sm-3">
                        <strong>参赛人数：</strong>
                        <span>{{teamsObj.matchesNumber}}</span>
                    </div>
                    <div class="col-sm-3">
                        <strong>是否参加离线测试：</strong>
                        <span v-if="teamsObj.offlineTest==='Y'">参加</span>
                        <span v-if="teamsObj.offlineTest==='N'">不参加</span>
                    </div>
                    <div class="col-sm-12 mtb">
                        <strong>车队组成单位：</strong>
                        <span>{{teamsObj.teamOrganization}}</span>
                    </div>
                </div>
                <div class="row" v-cloak>
                    <div class="col-sm-3">
                        <span></span>
                        <ul class="list-group">
                            <li class="list-group-item list-group-item-success"><strong>负责人信息</strong></li>
                            <li class="list-group-item ">
                                <strong>姓名：</strong>
                                <span>{{teamsObj.teamLeader}}</span>
                            </li>
                            <li class="list-group-item ">
                                <strong>性别：</strong>
                                <span v-if="teamsObj.gender===0">男</span>
                                <span v-if="teamsObj.gender===1">女</span>
                            </li>
                            <li class="list-group-item ">
                                <strong>职务/职称：</strong>
                                <span>{{teamsObj.duty}}</span>
                            </li>
                            <li class="list-group-item ">
                                <strong>手机：</strong>
                                <span>{{teamsObj.teamPhone}}</span>
                            </li>
                            <li class="list-group-item ">
                                <strong>办公电话：</strong>
                                <span>{{teamsObj.officePhone}}</span>
                            </li>
                            <li class="list-group-item ">
                                <strong>电子邮件：</strong>
                                <span>{{teamsObj.email}}</span>
                            </li>
                        </ul>
                    </div>
                    <div class="col-sm-9">
                        <div class="list-group">
                            <div class="list-group-item list-group-item-success"><strong>赛车参数信息</strong></div>
                            <div class="list-group-item">
                                <div class="w3">
                                    <strong>车长（毫米）：</strong><span>{{teamsObj.automobileLength}}</span>
                                </div>
                                <div class="w3">
                                    <strong>车宽（毫米）：</strong><span>{{teamsObj.automobileWidth}}</span>
                                </div>
                                <div class="w3">
                                    <strong>车高（毫米）：</strong><span>{{teamsObj.automobileHeight}}</span>
                                </div>
                            </div>
                            <div class="list-group-item">
                                <div class="w3">
                                    <strong>离去角（度）：</strong><span>{{teamsObj.departureAngle}}</span>
                                </div>
                                <div class="w3">
                                    <strong>接近角（度）：</strong><span>{{teamsObj.approachAngle}}</span>
                                </div>
                                <div class="w3">
                                    <strong>最小离地间隙（毫米）：</strong><span>{{teamsObj.minGroundClearance}}</span>
                                </div>
                            </div>
                            <div class="list-group-item">
                                <div class="w3">
                                    <strong>轮距（毫米）：</strong><span>{{teamsObj.wheelTrack}}</span>
                                </div>
                                <div class="w3">
                                    <strong>轴距（毫米）：</strong><span>{{teamsObj.wheelBase}}</span>
                                </div>
                                <div class="w3">
                                    <strong>最小转弯半径（毫米）：</strong><span>{{teamsObj.minTurningRadius}}</span>
                                </div>
                            </div>
                            <div class="list-group-item">
                                <div class="w3">
                                    <strong>自主行驶最高车速：</strong><span>{{teamsObj.maxSpeed}}</span>
                                </div>
                                <div class="w3">
                                    <strong>自主行驶最低车速：</strong><span>{{teamsObj.minSpeed}}</span>
                                </div>
                            </div>
                            <!--<div class="list-group-item">
                                <div class="tp">
                                    <p><strong>正视图</strong></p>
                                    <img style="width: 200px;cursor: pointer;" :src="getImgPath(teamsObj.frontView)" alt="" v-show-img>
                                </div>
                                <div class="tp auto-dot">
                                    <p><strong>侧视图</strong></p>
                                    <img style="max-width: 200px;width: 80%;cursor: pointer;" :src="getImgPath(teamsObj.lateralView)" alt="" v-show-img>
                                </div>
                            </div>-->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- jQuery -->
<script src="js/jquery.js"></script>
<!--layer-->
<script src="layui_src/lay/modules/layer.js"></script>
<!-- Bootstrap Core JavaScript -->
<script src="js/bootstrap.min.js"></script>
<!-- tab table-->
<script type="text/javascript" src="js/common.js" ></script>
<script src="nuget/content/scripts/toastr.js"></script>
<!-- Morris Charts JavaScript -->
<script type="text/javascript" src="js/vue/vue.js" ></script>
<script type="text/javascript" src="js/vue/vue-router.js" ></script>
<script src="js/vue/v-showImg.js"></script>
</body>
<script>
	var userName = localStorage.getItem("userName");    $("#userName").text(userName);
	var vue = new Vue({
		el: '#wrapper',
		data:{
			teamId: '',
			teamsObj: {}
		},
		mounted:function(){
			this.teamId = getQueryString("teamId",window.location.href); //用户传ID
			this.init();
		},
		methods:{
			init: function () {
				var _self = this;
				$.ajax({
					type: "get",
					url:url+'/users/'+adminId+'/teams/'+teamId,
					async: false,
					dataType: 'json',
					contentType: "application/json; charset=utf-8",
					beforeSend: function(request) {
						request.setRequestHeader("accessToken", accessToken);
					},
					success: function(data) {
						console.log(data);
						if(data.code == 1){
							var result = data.result;
							_self.teamsObj = result;
						}else{
							toastr['error'](data.description);
						}

					}
				});
			},
			getImgPath: function (path) {
				if(!path) return;
				var str = url + "/showImg?imgPath=" + path;
				return str;
			}
		}
	});
</script>
</html>